<script type="text/javascript">
	$(document).ready(function(){
		$("#profile-add-form").validate({
			rules : {
				username : "required",
				password : {
					required: true,
					minlength: 5 
				},
				password_re : {
					required: true,
					minlength: 5,
					equalTo: "#password" 
				},
				firstname : "required",
				lastname : "required",
				phone : {
					minlength : 7,
					maxlength : 40,
				},
				address : {
					maxlength : 255,
				},
				email: {
					required: true,
					email: true
				}, 								
			},
			messages : {
				username : "Hãy nhập tên tài khoản",
				password : {
					required : "Hãy cung cấp mật khẩu",
					minlength: "Mật khẩu của bạn cần hơn 5 kí tự"
				},
				password_re : {
					required: "Hãy cung cấp mật khẩu",
					minlength: "Mật khẩu của bạn cần hơn 5 kí tự",
					equalTo: "Hãy nhập trùng với mật khẩu ở trên" 
				},
				firstname : "Hãy nhập tên",
				lastname : "Hãy nhập họ",
				phone : {
					minlength: "Số điện thoại cần hơn 7 kí tự",
					maxlength: "Tối đa là 40 kí tự",
				},
				address : {
					maxlength: "Tối đa là 255 kí tự",
				},
				email: "Chưa nhập đúng email",
			},
			submitHandler: function(form) {
				dashboard.admin.profile.action.add(form);
			} 
		});
	});	
</script>

<div id="alert"></div>
<form class="form-horizontal" id="profile-add-form" method="POST">	
	<fieldset>	
		<div class="control-group">
			<label class="control-label">Username</label>
			<div class="controls">
				<input type="text" id="username" class="input-xlarge" value="" name="username" />
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">Password</label>
			<div class="controls">
				<input type="password" id="password" class="input-xlarge" value="" name="password" />
			</div>
		</div>	
		<div class="control-group">
			<label class="control-label">Confirm Password</label>
			<div class="controls">
				<input type="password" id="password_re" class="input-xlarge" value="" name="password_re" />
			</div>
		</div>	
		<div class="control-group">
			<label class="control-label">First Name</label>
			<div class="controls">
				<input type="text" id="firstname" class="input-xlarge" value="" name="firstname" />
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">Last Name</label>
			<div class="controls">
				<input type="text" id="lastname" class="input-xlarge" value="" name="lastname" />
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">Phone</label>
			<div class="controls">
				<input type="text" id="phone" class="input-xlarge" value="" name="phone" />
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">Address</label>
			<div class="controls">
				<input type="text" id="address" class="input-xlarge" value="" name="address" />
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">Email</label>
			<div class="controls">
				<input type="text" id="email" class="input-xlarge" value="" name="email" />
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">Group</label>
			<div class="controls">
				<label class="radio inline">
					<input type="radio"  value="0" name="group" />
					Manager
				</label>
				<label class="radio inline">
					<input type="radio"  value="1" name="group" />
					Administrator
				</label>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">Disable</label>
			<div class="controls">
				<label class="radio inline">
					<input type="checkbox"  value="1" name="status" />					
				</label>				
			</div>
		</div>
		<div class="form-actions">
			<button class="btn btn-primary" name="submit" value="submit" type="submit">Save changes</button>
			<a href="javascript:void(0)" onclick="javascript:history.go(-1);" class="btn">Cancel</a>
		</div>
	</fieldset>
</form>